<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>店铺激励规则管理</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
		<link rel="stylesheet" href="../../layuiadmin/style/admin.css" media="all">
		<link rel="stylesheet" href="../../layuiadmin/style/public.css" media="all">
	</head>
	<body>
		<div class="layui-fluid" id="LAY-component-grid-list">
			<div class="layui-card">
				<div class="layui-card-body">
					<!-- 搜索条件start -->
					<form class="layui-form meberMangement" action="">
						<div class="layui-row demo-list">
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">激励规则ID</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="精确搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">店铺机构类型</label>
									<div class="layui-input-block">
										<select>
											<option value=""></option>
											<option value="">全部</option>
											<option value="0">1</option>
											<option value="1">2</option>
										</select>
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item" style="margin-bottom: 0;">
									<label class="layui-form-label" style="padding: 0;">配置自定义商品类型</label>
									<div class="layui-input-block">
										<select>
											<option value=""></option>
											<option value="">全部</option>
											<option value="0">1</option>
											<option value="1">2</option>
										</select>
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">当前审核状态</label>
									<div class="layui-input-block">
										<select>
											<option value=""></option>
											<option value="">全部</option>
											<option value="0">1</option>
											<option value="1">2</option>
										</select>
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">广告类型</label>
									<div class="layui-input-block">
										<select>
											<option value=""></option>
											<option value="">全部</option>
											<option value="0">1</option>
											<option value="1">2</option>
										</select>
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">规则名称</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="模糊搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">激励类型</label>
									<div class="layui-input-block">
										<select>
											<option value=""></option>
											<option value="">全部</option>
											<option value="0">1</option>
											<option value="1">2</option>
										</select>
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">自定义分类名称</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="模糊搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">审核人</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="模糊搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm3 layui-col-md3 layui-col-lg2dot4">
								<div class="layui-form-item">
									<label class="layui-form-label">创建人</label>
									<div class="layui-input-block">
										<input type="text" autocomplete="off" placeholder="模糊搜索" class="layui-input">
									</div>
								</div>
							</div>
							<div class="layui-col-sm6 layui-col-md6 layui-col-lg12" style="justify-content: flex-end;display: flex;">
								<div class="layui-btn-container">
									<button type="button" class="layui-btn">清空搜索</button>
									<button type="button" class="layui-btn">导出</button>
									<button type="button" class="layui-btn" style="margin-right: 0;">搜索</button>
								</div>
							</div>
						</div>
					</form>
					<!-- 搜索条件end -->
					<!-- tab标签start -->
					<div class="layui-tab custom-tab">
						<div style="justify-content:space-between;display: flex;margin-bottom: -10px;">
							<ul class="layui-tab-title" style="border-bottom: none;">
								<li>
									<a href="allShopRuleManagement.html">全部</a>
								</li>
								<li class="layui-this">
									<a href="auditingShopRuleManagement.html">待审核</a>
								</li>
								<li>
									<a href="passShopRuleManagement.html">审核通过</a>
								</li>
								<li>
									<a href="failedShopRuleManagement.html">审核不通过</a>
								</li>
							</ul>

							<div class="layui-btn-container">
								<button type="button" class="layui-btn" style="margin:0;">新增激励规则</button>
							</div>

						</div>
						<div class="layui-tab-content" style="padding: 0;">
							<div class="layui-tab-item layui-show">
								<!-- 店铺激励规则管理start -->
								<div class="layui-table-meber">
									<table id="allMember" lay-filter="allMember" class="layui-table" lay-skin="nob"></table>
								</div>
								<!-- 店铺激励规则管理end -->

								<!-- 激励规则信息start -->
								<script type="text/html" id="webchatMsg">
									<div>
										<div class="meberId">激励规则ID：IR1000010008</div>
										<div class="list-data">
											<p>规则名称：</p>
											<p>规则描述：</p>
										</div>
									  </div>
								</script>
								<!-- 激励规则信息end -->
								<!-- 店铺信息start -->
								<script type="text/html" id="memberMsg">
									<div>
										<div class="meberId"></div>
										<div class="list-data">
											<p>应用店铺类型列表：</p>
											<p>自定义分类列表：</p>
										</div>
									  </div>
								</script>
								<!-- 店铺信息end -->
								<!-- 规则信息start -->
								<script type="text/html" id="registerMsg">
									<div class="table-barDemo">
									<div class="meberId"></div>
									<div class="list-data">
										<p>广告类型：</p>
										<p>配置自定义商品类型：自营配置</p>										
										<p>普通发票税点：</p>
										<p>增值税发票税点：</p>									
										<p>规则开始时间：</p>									
										<p>规则结束时间：</p>
									</div>
								  </div>
								</script>
								<!-- 规则信息end -->
								<!-- 状态信息start -->
								<script type="text/html" id="roleMsg">
									<div class="table-barDemo">
									<div class="meberId"></div>
									<div class="list-data">
										<p>当前审核状态：待审核</p>
										<p>资料更新重审状态：无</p>
										<p>创建人：</p>
										<p>创建时间：</p>
										<p>最后审核人：</p>
										<p>最后审核时间：</p>
									</div>
								  </div>
								</script>
								<!-- 状态信息end -->
								<!-- 操作start -->
								<script type="text/html" id="memberMsgOperate">
									<div class="table-barDemo">
									<div class="meberId"></div>
									  <a class="layui-btn layui-btn-sm" lay-event="audit">审核</a>
								  </div>
								</script>
								<!-- 操作end -->
							</div>
						</div>
					</div>
					<!-- tab标签end -->
				</div>
			</div>
		</div>
		<!-- 审核start -->
		<div class="log-box" id="log-box">
			<div class="layui-card">
				<div class="layui-card-body">
					<form class="layui-form" action="">
						<div class="layui-row demo-list">
							<div class="layui-form-item" style="font-weight:bold;margin-bottom:0;">
								<label>规则ID:XXX</label>
							</div>
							<div class="layui-form-item" style="margin-bottom:0;">
								<label>规则名称:XXX</label>
							</div>
							<div class="layui-form-item" style="margin-bottom:0;">
								<label>激励规则有效期:XXX至XXX</label>
							</div>
							
							<div class="layui-form-item" style="margin-bottom:0;">
								<label>已选店铺:</label>
							</div>
							<div class="layui-form-item">
								<table id="logTable" lay-filter="logTable" class="layui-table"></table>
							</div>

							<div class="layui-form-item">
								<label>规则描述:xxx</label>
							</div>

							<div class="layui-form-item" style="margin-bottom:0;">
								<label>已选分类和商品:</label>
							</div>
							<div class="layui-form-item">
								<table id="typeTable" lay-filter="typeTable" class="layui-table"></table>
							</div>

							<div class="layui-form-item" style="margin-bottom:0;">
								<label>广告类型：自营广告</label>
							</div>
							<div class="layui-form-item">
								<table id="advertisementTable" lay-filter="advertisementTable" class="layui-table"></table>
							</div>
							<div class="layui-form-item" style="margin-bottom:0;">
								<label>发票税点:增值税发票税点：10%；普通发票税点：8%</label>
							</div>
							<div class="layui-form-item" style="margin-bottom:0;">
								<label><span style="font-weight: bold;">激励类型：</span>自定义激励比例。</label>
							</div>
							<div class="layui-form-item">
								<table id="excitationTable" lay-filter="excitationTable" class="layui-table"></table>
							</div>									
							<div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
								<div style="text-align: center;">
									 <input type="checkbox" name="agree" lay-skin="primary" title="已阅读上述规则内容">
								</div>
								<div class="layui-btn-container" style="text-align: center;margin-top: 10px;">
									<button class="layui-btn">审核通过</button>
									<div class="layui-btn layui-btn-primary cancel-btn">审核不通过</div>
								</div>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
		<!-- 审核end -->

		<!-- 商品详情start -->
		<script type="text/html" id="goodsDetails">
			<div class="table-barDemo">
			  <a style="color: #007DDB;" lay-event="see">查看</a>
		  </div>
		</script>
		<!-- 商品详情end -->

		<!-- 上传广告图片start -->
		<script type="text/html" id="uploadImg">
			<div class="table-barDemo">
			  <a style="color: #007DDB;" lay-event="seeImg">查看图片</a>
		  </div>
		</script>
		<!-- 上传广告图片end -->
		<script src="../../layuiadmin/layui/layui.js"></script>
		<script>
			layui.config({
				base: '../../layuiadmin/' //静态资源所在路径
			}).extend({
				index: 'lib/index' //主入口模块
			}).use(['index', 'form', 'element', 'table', 'laydate', 'layarea'], function() {
				var $ = layui.$,
					admin = layui.admin,
					element = layui.element,
					form = layui.form,
					table = layui.table,
					laydate = layui.laydate,
					layarea = layui.layarea;

				//所有会员表格实例
				table.render({
					elem: '#allMember',
					url: layui.setter.base + 'json/table/user.js' //数据接口
						,
					page: true //开启分页
						,
					limit: 5,
					cols: [
						[ //表头
							{
								type: 'checkbox',
							}, {
								field: 'username',
								title: '激励规则信息',
								templet: '#webchatMsg'
							}, {
								field: 'sex',
								title: '店铺信息',
								templet: '#memberMsg'
							}, {
								field: 'city',
								title: '规则信息',
								templet: '#registerMsg'
							}, {
								field: 'sign',
								title: '状态信息',
								templet: '#roleMsg'
							}, {
								title: '操作',
								width: 120,
								align: 'center',
								toolbar: '#memberMsgOperate'
							}
						]
					]
				});
				//已选店铺表格实例
				table.render({
					elem: '#logTable',
					url: layui.setter.base + 'json/table/user.js' //数据接口
						,
					cols: [
						[ //表头
							{
								type: 'numbers',
								title: '序号',
							}, {
								field: 'sex',
								title: '店铺ID和名称',
							}, {
								field: 'city',
								title: '店铺机构类型',
							}
						]
					]
				});

				// 已选分类和商品表格实例
				table.render({
					elem: '#typeTable',
					url: layui.setter.base + 'json/table/user.js' //数据接口
						,
					cols: [
						[ //表头
							{
								type: 'numbers',
								title: '序号',
							}, {
								field: 'sex',
								title: '已选分类',
							}, {
								field: 'city',
								title: '分类类型',
							}, {
								field: 'city',
								title: '配置自定义分类商品类型',
							}, {
								field: 'city',
								title: '商品详情',
								align: 'center',
								toolbar: '#goodsDetails'
							}
						]
					]
				});

				// 广告类型：自营广告
				table.render({
					elem: '#advertisementTable',
					url: layui.setter.base + 'json/table/user.js' //数据接口
						,
					cols: [
						[ //表头
							{
								type: 'numbers',
								title: '序号',
							}, {
								field: 'id',
								title: '广告名称',
							}, {
								field: 'username',
								title: '广告位置',
							}, {
								field: 'sex',
								title: '广告图片大小',
							}, {
								field: 'city',
								title: '广告链接地址',
							}, {
								field: 'sign',
								title: '上传广告图片',
								width: 160,
								align: 'center',
								toolbar: '#uploadImg'
							}
						]
					]
				});
				
				// 激励类型
				table.render({
					elem: '#excitationTable',
					url: layui.setter.base + 'json/table/user.js' //数据接口
						,
					cols: [
						[ //表头
							{
								type: 'numbers',
								title: '序号',
								fixed: 'left'
							}, {
								field: 'id',
								title: '货品ID',
								width: 120
							}, {
								field: 'username',
								title: '商品名',
								width: 160
							}, {
								field: 'sex',
								title: '通用名',
								width: 160
							}, {
								field: 'city',
								title: '规格',
								width: 160
							}, {
								field: 'sign',
								title: '商品理论库存',
								width: 160
							}, {
								field: 'experience',
								title: '2B批发价A',
								width: 160
							}, {
								field: 'logins',
								title: '2C官方零售价B',
								width: 160
							}, {
								field: 'wealth',
								title: '推广价（默认A\B 比价取最大值）',
								width: 300,
								edit: 'text'
							}, {
								field: 'classify',
								title: '激励比例',
								width: 160,
								edit: 'text'
							}, {
								field: 'score',
								title: '激励一口价',
								width: 160,
								edit: 'text'
							}, {
								field: 'sign',
								title: '1件商品佣金预算',
								width: 200
							}
						]
					]
				});				

				//监听工具条
				table.on('tool(allMember)', function(obj) {
					var data = obj.data;
					console.log(data);
					switch (obj.event) {
						case 'audit':
							// 审核
							layer.open({
								type: 1,
								title: '审核',
								area: '900px',
								shade: 0.8,
								id: 'LAY_log' //设定一个id，防止重复弹出
									,
								btnAlign: 'c',
								moveType: 1 //拖拽模式，0或者1
									,
								content: $("#log-box"),
								success: function(layero) {

								}
							});
							break;
					}
					// if(obj.event === 'detail'){
					//   layer.msg('ID：'+ data.id + ' 的查看操作');
					// } else if(obj.event === 'del'){
					//   layer.confirm('真的删除行么', function(index){
					//     obj.del();
					//     layer.close(index);
					//   });
					// } else if(obj.event === 'edit'){
					//   layer.alert('编辑行：<br>'+ JSON.stringify(data))
					// }
				});

				// 取消按钮关闭所有弹出层
				$(".cancel-btn").on('click', function() {
					layer.closeAll();
				});

			});
		</script>
	</body>
</html>
